<template>
  <div class="box">
    <h1 class="box-header">404</h1>
    <el-button type="primary" class="box-btn" @click="back"
      >返回上一页</el-button
    >
  </div>
</template>

<script setup>
import { useRouter } from "vue-router";

const router = useRouter();

const back = () => {
  router.go(-1);
};
</script>

<style scoped>
.box {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  transition: all 0.3s;
}

.box-header {
  font-size: 100px;
  font-weight: bold;
  color: #333;
}

.box-btn {
  margin-top: 5px;
}
</style>
